<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>社区详情</title>
    <meta name="description" content="community detail"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <link rel="stylesheet" href="vendor/bower_components/bootstrap/dist/css/bootstrap.css" type="text/css"/>
    <link rel="stylesheet" href="css/community/community.css" type="text/css"/>
</head>
<body>

<div class="container-fluid">
    <section class="row post-container">
        <div class="col-xs-12">

            <div class="pull-left">
                <div class="post-user-head-container">
                    <img src="img/b5.jpg" class="img-circle img-responsive">
                </div>
            </div>
            <div class="pull-left post-user-info">
                <span class="post-user">白白棉花糖</span>
                <br>
                <span class="post-datetime">2016-05-12 10:00</span>
            </div>

            <div class="pull-right">
                <span class="look-count">756浏览</span>
                <span class="reply-count">6回复</span>
            </div>


            <div class="row">
                <div class="col-xs-12 post-content">
                    SASS是 CSS的扩展，增加了嵌套规则，变量，混入功能等很多更多。它简化了组织和维护CSS代码的成本。Compass
                    是一个开源的CSS框架，使得使用CSS3和流行的设计模式比以往任何时候都更容易。在这篇文章中，我们已经收集了一组有用的Sass和Compass工具，将帮助您快速。
                    <div class="post-image">
                        <img src="img/b0.jpg" class="   ">
                    </div>
                    <!--<div class="post-image">
                        <img src="img/b1.jpg" class="center-block img-responsive img-rounded">
                    </div>-->
                </div>

            </div>
        </div>
    </section>

    <div class="row like-users">
        <div class="col-xs-12">
            <div class="head-picture-container">
                <img src="img/b4.jpg" class="img-circle img-responsive">
            </div>
            <div class="head-picture-container">
                <img src="img/b1.jpg" class="img-circle img-responsive">
            </div>
            <div class="head-picture-container">
                <img src="img/b0.jpg" class="img-circle img-responsive">
            </div>
            <div class="head-picture-container">
                <img src="img/b2.jpg" class="img-circle img-responsive">
            </div>
            <div class="pull-right">
                <span class="like-count">共18个赞</span>
            </div>
        </div>

    </div>

    <div class="row post-comment">
        <div class="col-xs-12">
            <div class="row comment-line">
                <div class="col-xs-2">
                    <div class="comment-head-container">
                        <img src="img/b5.jpg" class="img-circle img-responsive">
                    </div>
                </div>
                <div class="col-xs-10">
                    <div class="row">
                        <div>
                            <span class="comment-user">白白棉花糖</span>
                            <span class="comment-time">05-13: 09:14</span>
                        </div>
                        <p>
                            Matter.js是一个JavaScript2D刚体物理引擎的网页。Matter.Engine模块包含用于创建和操作引擎的方法。这个引擎是一个管理更新和渲染世界的模拟控制器。Matter.js目前是测试版本，这意味着API仍在开发中，可能偶尔会发生变化。
                        </p>
                    </div>

                </div>
            </div>


            <div class="row comment-line">
                <div class="col-xs-2">
                    <div class="comment-head-container">
                        <img src="img/b5.jpg" class="img-circle img-responsive">
                    </div>
                </div>
                <div class="col-xs-10">
                    <div class="row">
                        <div>
                            <span class="comment-user">白白棉花糖</span>
                            <span class="comment-time">05-13: 09:14</span>
                        </div>
                        <p>
                            回复<span class="reply-to-other">@花楼:</span>这外形真心丑的不要不要的
                        </p>
                    </div>

                </div>
            </div>


            <div class="row comment-line">
                <div class="col-xs-2">
                    <div class="comment-head-container">
                        <img src="img/b5.jpg" class="img-circle img-responsive">
                    </div>
                </div>
                <div class="col-xs-10">
                    <div class="row">
                        <div>
                            <span class="comment-user">白白棉花糖</span>
                            <span class="comment-time">05-13: 09:14</span>
                        </div>
                        <p>
                            <span class="reply-to-other">@花楼:</span>
                        </p>
                    </div>

                </div>
            </div>

            <div class="row comment-line">
                <div class="col-xs-2">
                    <div class="comment-head-container">
                        <img src="img/b5.jpg" class="img-circle img-responsive">
                    </div>
                </div>
                <div class="col-xs-10">
                    <div class="row">
                        <div>
                            <span class="comment-user">白白棉花糖</span>
                            <span class="comment-time">05-13: 09:14</span>
                        </div>
                        <p>
                            <span>如果发现没有效果的话,还可以在"显示与亮度"</span>
                        </p>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>